/* 
.msglist::-webkit-scrollbar{
  background-color: transparent;
  width: 5px;
}
.msglist::-webkit-scrollbar-thumb {
  border-radius: 10px;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  background-color: gray;
  width: 3px;
}
.msglist::-webkit-scrollbar-track{
  background: transparent;
} */
@media (max-width: 640px) {
  .msglist {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}
img {
  display: inline-block;
}
.notice {
  @apply bg-gray-50 text-icon;
}
.msglist {
  scroll-behavior: smooth;
}
.me .name {
  text-align: right;
}
.me .msg_item_main {
  justify-content: flex-end;
}
.msg_item_main_info {
  @apply ml-3;
}
.me .msg_item_main_info {
  @apply mr-3;
}
.me .head {
  order: 1;
}
.content {
  @apply bg-chat;
  min-width: 30px;
  min-height: 40px;
}
.content.loading::after {
  content: " ";
  width: 16px;
  height: 16px;
  background: url("../../../../assets/loading.gif");
  position: absolute;
  right: -20px;
  top: 10px;
}
.me .content.loading::after {
  content: " ";
  width: 16px;
  height: 16px;
  background: url("../../../../assets/loading.gif");
  position: absolute;
  left: -20px;
  top: 10px;
}
.content::before {
  content: " ";
  width: 0px;
  height: 0px;
  background-color: var(--bg-chat);
  position: absolute;
  left: -3px;
  top: 13px;
  border: solid 6px var(--bg-chat);
  transform: rotateZ(45deg);
}
.me .content::before {
  content: " ";
  width: 0px;
  height: 0px;
  background-color: var(--bg-chat);
  position: absolute;
  left: calc(100% - 9px);
  top: 13px;
  border: solid 6px var(--bg-chat);
  transform: rotateZ(45deg);
}
